import 'package:date_format/date_format.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_cupertino_datetime_picker/flutter_cupertino_datetime_picker.dart';
import 'package:imember/Util/Global.dart';
import 'package:imember/Util/MyColor.dart';
import 'package:imember/Util/PageUtil.dart';
import 'package:imember/Widget/MyButton.dart';
import 'package:imember/Widget/MyDialog.dart';
import 'package:imember/Widget/MyImage.dart';
import 'package:imember/Widget/MyPage.dart';

class OnlineOrder extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return OnlineOrderState();
  }
}

class OnlineOrderState extends State {
  @override
  Widget build(BuildContext context) {
    return MyPage(
      Container(
        child: true
            ? Record()
            : Center(child: Text("目前尚無紀錄", style: TextStyle(fontSize: 30, color: MyColor.C70, fontWeight: FontWeight.bold))),
      ),
      showIcon: true,
      showNotice: true,
    );
  }
}

class Record extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.fromLTRB(12, 22, 12, 0),
      child: Column(
        children: [
          Row(
            children: [
              Expanded(flex: 1, child: Center(child: Text("訂單編號", style: TextStyle(color: MyColor.C70, fontSize: 20)))),
              Expanded(flex: 1, child: Center(child: Text("訂單時間", style: TextStyle(color: MyColor.C70, fontSize: 20)))),
              Expanded(flex: 1, child: Center(child: Text("訂單類別", style: TextStyle(color: MyColor.C70, fontSize: 20)))),
              Expanded(flex: 1, child: Center(child: Text("購買人姓名", style: TextStyle(color: MyColor.C70, fontSize: 20)))),
              Expanded(flex: 1, child: Center(child: Text("預計到貨時間", style: TextStyle(color: MyColor.C70, fontSize: 20)))),
              Expanded(flex: 2, child: Center(child: Text("操作", style: TextStyle(color: MyColor.C70, fontSize: 20))))
            ],
          ),
          Container(height: 1.5, color: MyColor.C70_80, margin: EdgeInsets.only(top: 18)),
          Expanded(
              child: ListView.builder(
                  padding: EdgeInsets.all(0),
                  itemCount: 4,
                  itemBuilder: (BuildContext context, int index) {
                    return ItemRecord();
                  }))
        ],
      ),
    );
  }
}

class ItemRecord extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 70,
      margin: EdgeInsets.all(8),
      decoration: Global.getWhiteBg_shadow(8, MyColor.C9),
      child: Row(
        children: [
          Expanded(flex: 1, child: Center(child: Text("00909009", style: TextStyle(color: MyColor.Black, fontSize: 19)))),
          Expanded(flex: 1, child: Center(child: Text("09/20 13:00", style: TextStyle(color: MyColor.Black, fontSize: 19)))),
          Expanded(flex: 1, child: Center(child: Text("外送", style: TextStyle(color: MyColor.Black, fontSize: 19)))),
          Expanded(flex: 1, child: Center(child: Text("張星雨", style: TextStyle(color: MyColor.Black, fontSize: 19)))),
          Expanded(flex: 1, child: Center(child: Text("-", style: TextStyle(color: MyColor.Black, fontSize: 19)))),
          Expanded(
              flex: 2,
              child: Center(
                  child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  Button("接單", bgColor: MyColor.Orange, fontColor: MyColor.White, fontSize: 19, height: 35, radius: 22, width: 74,
                      onTap: () {
                    showWidgetDialog(context, confirmReceiveDialog());
                  }),
                  Button("取消",
                      bgColor: MyColor.Red62, fontColor: MyColor.White, fontSize: 19, height: 35, radius: 22, width: 74, onTap: () {}),
                ],
              )))
        ],
      ),
    );
  }
}

class confirmReceiveDialog extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _confirmReceiveDialog();
  }
}

class _confirmReceiveDialog extends State {
  String selectedTime = "";

  @override
  Widget build(BuildContext context) {
    return Container(
        width: 708,
        margin: EdgeInsets.only(bottom: 120),
        decoration: Global.getWhiteBg(8),
        child: Column(mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [
          Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            LocalImage("ic_back_g.png", width: 50, padding: EdgeInsets.all(2), onTap: () {
              PageUtil().back(context);
            }),
            Text("確認接受訂單", style: TextStyle(fontSize: 24, color: MyColor.C70, fontWeight: FontWeight.bold)),
            Container(width: 34)
          ]),
          Container(height: 1, color: MyColor.DD),
          Container(
              padding: EdgeInsets.fromLTRB(18, 18, 18, 18),
              child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
                Text("訂單編號：0290343802", style: TextStyle(fontSize: 24, color: MyColor.C70, height: 2)),
                Text("訂單狀態：已付款", style: TextStyle(fontSize: 24, color: MyColor.C70, height: 2)),
                Text("運送方式：自取", style: TextStyle(fontSize: 24, color: MyColor.C70, height: 2)),
                Text("總計金額：222", style: TextStyle(fontSize: 24, color: MyColor.C70, height: 2)),
                Row(
                  children: [
                    Text("預計到貨時間：", style: TextStyle(fontSize: 24, color: MyColor.C70, height: 2)),
                    Expanded(
                        child: GestureDetector(
                            child: Container(
                                height: 36,
                                alignment: Alignment.centerLeft,
                                padding: EdgeInsets.only(left: 9),
                                decoration: Global.getBoxBg(18, MyColor.F5),
                                child: Text(selectedTime, style: TextStyle(fontSize: 24, color: MyColor.C70))),
                            onTap: () {
                              FocusManager.instance.primaryFocus?.unfocus();
                              DatePicker.showDatePicker(context,
                                  dateFormat: "yyyy年 MM月 dd日 HH時 mm分",
                                  pickerTheme: DateTimePickerTheme(confirm: Text("確認", style: TextStyle(fontSize: 14, color: MyColor.C58))),
                                  onConfirm: (DateTime dateTime, List<int> selectedIndex) {
                                setState(() {
                                  selectedTime = formatDate(dateTime, [yyyy, '-', mm, '-', dd, ' ', HH, ':', nn]);
                                });
                              });
                            }))
                  ],
                ),
                Container(height: 16),
                Row(mainAxisAlignment: MainAxisAlignment.end, children: [
                  Button("取消", bgColor: MyColor.C4, fontColor: MyColor.White, fontSize: 22, height: 36, radius: 20, width: 88, onTap: () {
                    PageUtil().back(context);
                  }),
                  Container(width: 16),
                  Button("確認收單", bgColor: MyColor.Orange, fontColor: MyColor.White, fontSize: 22, height: 36, radius: 20, width: 126),
                ])
              ]))
        ]));
  }
}
